<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学生列表</title>
    <style>
        table{
            border-collapse: collapse;
        }
        th,td{
            border: 1px #000 solid;
            font-size: 20px;
            padding: 10px;
            text-align: center;
        }
    </style>
</head>
<body>
    <table>
        <caption>学生列表</caption>
        <thead>
            <tr>
                <th>学号</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>性别</th>
                <th>地址</th>
            </tr>
        </thead>
        <tbody>
            <% for(const stu of stus) { %>
                <tr>
                    <td><%=stu.id %></td>
                    <td><%=stu.name %></td>
                    <td><%=stu.age %></td>
                    <td><%=stu.gender %></td>
                    <td><%=stu.address %></td>
                    <td><a
                        onclick="return confirm('确认删除吗？')"
                        href="/delete?id=<%=stu.id%>">删除</a><a href="/to-update?id=<%=stu.id%>">修改</a></td>
                </tr>
            <%}%>
        </tbody>
    </table>

    <hr>
    <form action="/add-stu" method="post">
        <div>姓名：<input type="text" name="name"></div>
        <div>年龄：<input type="number" name="age"></div>
        <div>性别：<input type="radio" name="gender" max="150" min="0" value="男">男
            <input type="radio" name="gender" value="女">女</div>
        <div>地址<input type="text" name="address"></div>
        <div><button>添加</button></div>
    </form>
</body>
</html>